<template>
    <div>
     <MyName/>
     <hr>
    <router-link class="hh" to="/home" active-class="active">Home</router-link>
    <router-link class="hh" to="/about" active-class="active">About</router-link>
    <router-view></router-view>
    </div>
</template>

<script>
import MyName from './componets/MyName.vue'
export default {
    name: 'App',
    components:{
        MyName
    }
}
</script>

<style>
.hh{
    display: inline-block;
    padding: 5px 10px;
    margin: 0 10px;
    border: 1px red solid;
    background-color: yellow;
    text-decoration: none;
}
.active{
    background-color: aqua;
}
</style>